<template>
  <a-card :bordered="false">
    <detail-list title="退单详情">

      <detail-list-item term="服务号">{{model.serviceNumber}}</detail-list-item>

      <detail-list-item term="订单编号">{{model.orderId}}</detail-list-item>

      <detail-list-item term="退回金额">{{model.refundPrice}}</detail-list-item>

      <detail-list-item term="退货原因">{{model.reason}}</detail-list-item>

      <detail-list-item term="换货原因">{{model.describe}}</detail-list-item>

      <detail-list-item term="服务类型">{{model.serviceType ==1?"退货":"退款"}}</detail-list-item>

      <detail-list-item term="状态">
        <span v-if="orderReturnStatus == 0">申请换货</span>
        <span v-else-if="orderReturnStatus == 1">申请成功</span>
        <span v-else-if="orderReturnStatus == 2">申请失败</span>
        <span v-else-if="orderReturnStatus == 3">退货中</span>
        <span v-else-if="orderReturnStatus == 3">退货成功</span>
      </detail-list-item>

      <detail-list-item term="同意时间">{{model.approvalTime}}</detail-list-item>

      <detail-list-item term="拒绝时间">{{model.refuseTime}}</detail-list-item>

      <detail-list-item term="收货时间">{{model.receiverTime}}</detail-list-item>

      <detail-list-item term="成交时间">{{model.closingTime}}</detail-list-item>

    </detail-list>
    <a-button  size="large" type="danger" @click="closeTab()" style="float : right">关闭</a-button>
  </a-card>
</template>

<script>
  import PageLayout from '@/components/page/PageLayout'
  import STable from '@/components/table/'
  import DetailList from '@/components/tools/DetailList'
  import ABadge from "ant-design-vue/es/badge/Badge"
  import { getAction } from '@/api/manage'
  const DetailListItem = DetailList.Item
  export default {
    components: {
      PageLayout,
      ABadge,
      DetailList,
      DetailListItem,
      STable
    },
    data () {
      return {
        orderReturnStatus:{},
        model:{},
      }
    },
    created(){
      this.getOrderReturnDetails(this.$route.query.record.id);
    },
    mounted(){
    },
    activated(){
      this.getOrderReturnDetails(this.$route.query.record.id);
    },
    methods:{
      getOrderReturnDetails(ids) {
        let toParams = {id:ids};
        this.$nextTick(function () {
          getAction("/admin/order_return/detail",toParams )
            .then(res => {
              if (res.success) {
                this.model = res.result
                this.orderReturnStatus = this.model.status
              }
            })
            .catch(err => {
            });
        })
      },
      //关闭标签
      closeTab(){
        this.$router.back()
      },
    },
    computed: {
      title () {
        return this.$route.meta.title
      }
    },

  }
</script>

<style lang="scss" scoped>
  .title {
    color: rgba(0,0,0,.85);
    font-size: 16px;
    font-weight: 500;
    margin-bottom: 16px;
  }
</style>